@use '../../../css/mixins/components';

/**
 * Header
 */

.header {
    @include components.background('header');
    @include components.color('header');
    @include components.transition('header');
    @include components.padding('header');

    display: flex;
    box-sizing: border-box;
    width: 100%;

    /* stylelint-disable selector-list-comma-newline-after */
    > .container,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .h6 {
        margin-top: 0;
    }
    /* stylelint-enable */

    &.-cover {
        background-repeat: no-repeat;
        background-position: center center;
        background-attachment: unset;
        background-size: cover;
    }

    &.-fullscreen {
        padding: 0;
        align-items: center;
        width: 100vw;
        height: 100vh;
        max-width: 100%;
        max-height: 100%;
    }
}
